import React, { Component } from 'react';
import { getBillList } from '../../../api'
import './style.scss'
class Index extends Component {
  state = {
    list: []
  }
  async getBillListAndSet() {
    const resp = await getBillList()
    const { data } = resp.data
    this.setState({
      list: data
    })
  }
  toDetail(v) {
    const { history } = this.props
    console.log(history);
    // history.push('/detail')
    history.push({
      pathname: '/detail/' + v.id,
      state: {
        ...v
      }
    })
  }
  render() {
    const { list } = this.state
    return (
      <div>
          <ul className="bill-list">
            {
              list.length > 0 && list.map((v, i) => {
                return (
                  <li key={i} onClick={ () => this.toDetail(v) }>
                    <p>名称： {v.name}-----类型： { v.type }</p>
                    <p>备注： { v.tip }</p>
                    <p>金额： { v.price }</p>
                  </li>
                )
              })
            }
          </ul>
      </div>
    );
  }
  componentDidMount() {
    this.getBillListAndSet()
  }
}

export default Index;
